<html>
<HEAD>
<title>gsensor</title>

</HEAD>
<BODY>

<div align="center" style="background-image:url(images/paodao.jpg); background-position:center; width:100%; height:100%">
<img id="car" src="./images/car.png" width="80" height="120" style="position:relative; top:300">
</div>


<script type="text/javascript">

var x;
var y;
var i = 0;
var j = 0;
var tx;
var ty;

function updateView()
{
    timer = setInterval(function() {
        var xmlhttp;
        xmlhttp=new XMLHttpRequest();
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                var str = xmlhttp.responseText;
                var split_str = str.split(" ", 2);
                var x_str = split_str[0];
                var y_str = split_str[1];
                x = parseInt(x_str);
                y = parseInt(y_str);
                var carobj = document.getElementById("car");
                tw = parseInt(carobj.style.left+0);
                th = parseInt(carobj.style.top+0);
                if(x > 150) {
                    j = th + 5;
                    if(j > 620)
                        j = 620;
                }
                if(x < -150) {
                    j = th - 5;
                    if(j < 0)
                        j = 0;
                }
                if(y > 150) {
                    i = tw + 5;
                    if(i > 600)
                        i = 600;
                }
                if(y < -150) {
                    i = tw - 5;
                    if(i < -600)
                        i = -600;
                }
                carobj.style.left = i;
                carobj.style.top = j;
            }
        }
        xmlhttp.open("GET","gsensor.php?date="+ new Date().toTimeString(),true);
        xmlhttp.send();
    }, 10); 
}


window.onload = function() {
    updateView();
}

</script>

</body>
</html>
